<template>
  <section>
    <el-tabs v-if="activity.activityNodes.length >0" v-model="clickTab">
      <el-tab-pane :label="node.name" :name="node.activityProperties.code" v-for="node in activity.activityNodes" :key="node.id">
        <div v-if="clickTab === 'judge_age' && node.activityProperties.code === 'judge_age'">
          <judge-age :node="node" v-on:save="saveNode(node)" v-on:del="delNode(node)"></judge-age>
        </div>
        <div v-if="clickTab === 'send_coupon' && node.activityProperties.code === 'send_coupon'">
          <send-coupon :node="node"></send-coupon>
        </div>
      </el-tab-pane>
    </el-tabs>
    <el-row v-else>
      该活动当前没有活动节点，请先设置
    </el-row>
  </section>
</template>

<script>
  import {mapGetters, mapActions, mapMutations} from 'vuex'
  import Vue from 'vue'//后续添加属性，需要vue联动
  import dateFormater from '@/common/date-formater'
  import errHandler from '@/assets/errHandler'
  import sendCoupon from '@/components/activity/nodeModel/sendCoupon'
  import judgeAge from '@/components/activity/nodeModel/judgeAge'
  export default {
    name: "activityNode",
    props: ['activity'],
    components: {sendCoupon,judgeAge},
    data() {
      return {
        clickTab:'',
        selProperties:[],
        propertiesList:null,
      }
    },
    created(){
      console.log(this.activity)
      if(this.activity.activityNodes.length>0){
        this.clickTab = this.activity.activityNodes[0].activityProperties.code
      }else {

      }
    },
    computed:{
    },
    watch: {
    },
    methods: {
      ...mapActions({
        fetch: 'fetch'
      }),
      subNodeDetail(row){
        row.edit=!row.edit
        console.log(row)
      },
      saveNode(node){
        console.log(node)
        //更新node
        this.updateActivityNode(node)
      },
      updateActivityNode(node){
        this.fetch({name:"updateActivityNode",data:{...node}})
          .then(res=>{
            console.log(res)
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      delNode(node){
        console.log(node)
        // this.deleteActivityNode(node.id)
      },
      deleteActivityNode(id){
        this.fetch({name:"deleteActivityNode",data:{id}})
          .then(res=>{
            this.activity.activityNodes=res.activityNodes
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      }
    }
  }
</script>

<style scoped>

</style>
